<template>
    <div class="mod-config">
        <el-form :model="dataForm" :inline="true" ref="dataForm" label-width="80px">
            <el-form-item prop="tableName">

            </el-form-item>
            <el-form-item prop="tableName">
                <el-input type="text" v-model="dataForm.tableName" auto-complete="off" placeholder="表名" clearable></el-input>
            </el-form-item>
    <!--        <el-form-item prop="checkPass">-->
    <!--            <el-input type="password" v-model="ruleForm.checkPass" auto-complete="off" placeholder="密码"></el-input>-->
    <!--        </el-form-item>-->
    <!--        <el-checkbox v-model="checked" checked class="remember">记住密码</el-checkbox>-->
            <el-form-item>
                <el-button type="primary" style="width:100%;" @click.native.prevent="getDataList" :loading="logining">查询</el-button>
            </el-form-item>
        </el-form>
        <el-table
                :data="dataList"
                border
                v-loading="dataListLoading"
                @selection-change="selectionChangeHandle"
                style="width: 100%;">
            <el-table-column
                    type="selection"
                    header-align="center"
                    align="center"
                    width="50">
            </el-table-column>
            <el-table-column
                    prop="tableName"
                    header-align="center"
                    align="center"
                    width="300"
                    label="表名">
            </el-table-column>
            <el-table-column
                    prop="engine"
                    header-align="left"
                    align="left"
                    width="200"
                    label="Engine">
            </el-table-column>
            <el-table-column
                    prop="tableComment"
                    header-align="left"
                    align="left"
                    width="200"
                    label="表备注">
            </el-table-column>
            <el-table-column
                    prop="createTime"
                    header-align="left"
                    align="left"
                    width="240"
                    label="创建时间">
            </el-table-column>
            <el-table-column
                    fixed="right"
                    align="center"
                    width="480"
                    label="操作">
                <template slot-scope="scope">
                    <el-button type="success" size="small" @click.native.prevent="toGenPage(scope.row.tableName, scope.row.tableComment)" >生成</el-button>
                </template>
            </el-table-column>
        </el-table>
        <el-pagination
                @size-change="sizeChangeHandle"
                @current-change="currentChangeHandle"
                :current-page="pageIndex"
                :page-sizes="[10, 20, 50, 100]"
                :page-size="pageSize"
                :total="totalPage"
                layout="total, sizes, prev, pager, next, jumper">
        </el-pagination>
        <gen-form v-if="genVisible" ref="genFormRef"></gen-form>
    </div>
</template>

<script>
    import GenForm from './components/gen-form'

    export default {
        data() {
            return {
                dataForm: {
                    tableName: ''
                },
                dataList: [],
                pageIndex: 1,
                pageSize: 10,
                totalPage: 0,
                dataListLoading: false,
                dataListSelections: [],
                logining: false,
                result: null,
                genVisible: false
            };
        },
        components: {
            GenForm
        },
        mounted () {
            this.getDataList()
        },
        methods: {
            // 获取数据列表
            getDataList () {
                this.dataListLoading = true
                this.$http({
                    url: '/sys/generator/list',
                    method: 'get',
                    params: this.$http.adornParams({
                        'page': this.pageIndex,
                        'limit': this.pageSize,
                        'tableName': this.dataForm.tableName
                    })
                }).then(({data}) => {
                    if (data && data.code === 0) {
                        this.dataList = data.page.list
                        this.totalPage = data.page.totalCount
                    } else {
                        this.dataList = []
                        this.totalPage = 0
                    }
                    this.dataListLoading = false
                })
            },
            // 每页数
            sizeChangeHandle (val) {
                this.pageSize = val
                this.pageIndex = 1
                this.getDataList()
            },
            // 当前页
            currentChangeHandle (val) {
                this.pageIndex = val
                this.getDataList()
            },
            // 多选
            selectionChangeHandle (val) {
                this.dataListSelections = val
            },
            toGenPage (tableName, tableComment) {
                this.$http({
                    url: '/sys/generator/columns',
                    method: 'get',
                    params: this.$http.adornParams({
                        'tableName': tableName
                    })
                }).then(({data}) => {
                    console.info('---->', data)
                    if (data && data.code === 0) {
                        this.result = data.result
                        this.showDialog(tableName, tableComment, this.result)
                    } else {
                        this.$notify({
                            title: '出错了!',
                            type: 'error',
                            message: data.msg,
                            duration: 5000
                        })
                    }
                })
            },
            showDialog (tableName, tableComment, result) {
                this.genVisible = true
                this.$nextTick(() => {
                    this.$refs.genFormRef.init(tableName, tableComment, result)
                })
            }
        }
    }

</script>
<style >

</style>
